@import "public";
//head部分
#headContainer{
    width:100%;
    height:96px;
    .head{
        margin:0 auto;
        width:1190px;
        height:96px;
//      logo部分
        .logo-container{
            width:390px;
            height:96px;
            float:left;
            overflow:hidden;
            .left-logo{
                width:140px;
                height:96px;
                display: inline-block;
               // float:left;
                overflow:hidden;
                img{
                    width:140px;
                    height:96px;
                }
            }
            .right-logo{
                width:190px;
                height:96px;
                display:inline-block;
                overflow:hidden;
                margin-left: 55px;
                img{
                    width:190px;
                    height:96px;
                }
            }
        }
//      搜索栏部分
        .search-container{
            float:left;
            width:340px;
            margin:29px 0 0 60px;
            .search-form{
                position:relative;
                .search-input{
                    padding: 5px 40px 5px 0;
                    border: 1px solid #e5e1df;
                    width: 100%;
                    height: 40px;
                    //background: none;
                    //color: #33302e;
                    //font-size: 14px;
                    box-sizing: border-box;// 弹性盒模型
                    border-radius: 2px;
                    line-height: 28px;
                    //text-indent: 9px;文字缩进
                }
                .search-btn{
                    position:absolute;
                    top:0;
                    right:0;
                    float:right;
                    width:40px;
                    height:40px;
                    .icon-search{
                        position:absolute;//定位后不用再转换为inline-block
                        top:0;
                        left:0;
                        right:0;
                        bottom:0;
                        margin:auto;//定位到元素正中的位置的方法
                        //display:inline-block;
                        width:20px;
                        height:20px;
                        background:url(../img/indeximg/top.png) no-repeat;
                        overflow:hidden;
                    }
                }
            }
        }
//      购物车部分
        .cart{
            float:right;
            width:140px;
            height:40px;
            line-height: 40px;
            margin:28px 100px 0 0;
            .icon-cart{
                display:inline-block;
                width:20px;
                height:20px;
                vertical-align: middle;
                background: url(../img/indeximg/top.png) no-repeat -22px;
                margin-left: 10px;
                margin-right: 10px;
            }
            .cart-title{
                display:inline-block;
                font-size: 14px;
                color:#33302e;
            }
        }
    }
}
//导航部分
#navContainer{
//  导航容器部分
    width:100%;
    min-width: 1190px;
    height:38px;
    border-top:1px solid #e5e1df;
    border-bottom:1px solid #e5e1df;
    position:relative;
    .head-nav{
        margin:0 auto;
        width:1190px;
//      商品分类部分
        .categories{
            position:absolute;
            top:-1px;
            .cate-title{
                width:140px;
                line-height:40px;
                color:#fff;
                background: #33302E;
                font-size: 14px;
                text-align: center;
                .icon-cate{
                    display:inline-block;
                    width:20px;
                    height:20px;
                    background: url(../img/indeximg/index.png) no-repeat;
                    vertical-align: middle;
                    margin-left:10px;
                }
            }
        }
//      导航部分
        .nav-container{
            position:relative;
            float:left;
            margin-left: 200px;
            line-height:38px;
            li{
                float:left;
                .nav-item{
                    padding:0 25px;
                    color:#33302e;
                    font-weight:700;
                    font-size:14px;
                }
                .first{
                    padding-left:0;
                    color:#f60;
                }
            }
            .nav-line{
                display: block;
                //left:0;
                position:absolute;
                top:31px;
                .line{
                    display:block;
                    width:28px;
                    height:2px;
                    margin:0 auto;
                    background:#f60;
                }
            }
        }
    }
}
//页面主体部分
.detail{
    margin:0 auto;
    width:1200px;
//  当前地址部分
    .adress{
        float:left;
        width:100%;
        margin:0 5px;
        height: 40px;
        line-height: 40px;
        color: #99918b;
        font-size: 12px;
        a{
            color:#99918B;
        }
    }
//  产品相册部分
    .pro-album{
        width:540px;
        float:left;
        margin:0 5px;
        .big-pic{
            position: relative;
            width:540px;
            height:360px;
            img{
                width:540px;
                height:360px;
            }
            //background:url(../img/detailimg/album-big-1.jpg) no-repeat center;
            //background-size:cover;
            .smallCursor{
                position: absolute;
                left: 0;
                top: 0;
                width: 40px;
                height: 40px;
                background: rgba(200,198,255,0.8);
                display: none;
            }
        }
        .bigCursor{
            position:absolute;
            left:617px;
            top:200px;
            width:600px;
            height:400px;
            overflow: hidden;
            display: none;
            border:1px solid #FF6600;
            z-index: 10;
            img{
                width:1100px;
                height:700px;
                position: absolute;
                left: 0;
                top: 0;
            }
        }
        .pro-album-small{
            position:relative;
            padding:20px 0;
            li{
                float:left;
                margin-right:10px;
                border:3px solid #B4B4B4;
                img{
                    width:97px;
                    height:65px;
                }
            }
        }
        .pro-album-info{
            width:540px;
            height:20px;
            span{
                float:left;
                line-height:20px;
                font-size:14px;
                color:#333333;
            }
            i{
                float:left;
                line-height: 20px;
                font-size: 14px;
                color:#333333;
                margin-left: 40px;
            }
            a{
                float:right;
                line-height: 20px;
                color:#333333;
                i{
                    display: inline-block;
                    width: 24px;
                    height: 20px;
                    background: url(../img/largebg.png)no-repeat -3680px -4px;
                }
            }
        }
    }
//  产品信息部分
    .pro-info{
        width:610px;
        margin:0 5px;
        float:left;
        padding-left:30px;
        .info-title{
            height:24px;
            line-height: 24px;
            font-size: 18px;
            font-weight:900;
            color:#333333;
            i{
                display:inline-block;
                padding: 0 3px;
                margin-right: 5px;
                font-size: 14px;
                font-weight: 200;
                background: #FF6600;
                color:#fff;
            }
            span{
                font-weight: 100;
            }
        }
//      价格部分
        .info-price{
            position: relative;
            padding: 10px 5px 10px 0;
            min-height: 96px;
            margin-top: 10px;
            margin-bottom: 20px;
            color: #fff;
            background: #FF6600;
            .info-price-item{
                display: table;
                width: 100%;
                padding: 8px 0 5px;
                dt{
                    display: inline-block;
                    width: 70px;
                    text-align: right;
                    vertical-align: middle;
                    font-size: 14px;
                    .time{
                        display: inline-block;
                        padding: 1px 5px;
                        margin-right: 10px;
                        color: #f60;
                        font-size: 14px;
                        background-color: #ffe400
                    }
                }
                dd{
                    display: inline-block;
                    width: 520px;
                    padding-left: 10px;
                    line-height: 22px;
                    vertical-align: middle;
                    span{
                        font-size: 12px;
                    }
                    .price-num{
                        font-size:24px;
                        font-weight:900;
                    }
                    
                }
            }
//          二维码部分
            .qrcode{
                position:absolute;
                right: 20px;
                top: 20px;
                border: 1px solid #ccc;
                background-color: #fff;
            }
        }
//      配送部分
        .info-adress{
            display:table;
            dt{
                display: table-cell;
                font-size: 12px;
                width: 53px;
                padding-right: 10px;
                text-align: left;
                vertical-align: middle
            }
            dd{
                position: relative;
                display: inline-block;
                min-width: 100px;
                max-width: 400px;
                height:30px;
                line-height: 30px;
                border:1px solid #8C8C8C;
                vertical-align: middle;
                font-size: 12px;
                span{
                    padding: 0 3px;
                    margin-right:7px;
                }
                b{
                    display:inline-block;
                    width:15px;
                    height:8px;    
                    background: url(../img/detailimg/detail-bg.png) no-repeat;
                    margin-right: 5px;
                }
            }
        }
//      服务部分
        .service-list{
            display: table;
            padding-bottom: 5px;
            position: relative;
           dt{
                display: table-cell;
                width: 53px;
                padding-right: 10px;
           }
           dd{
                display: inline-block;
                padding: 3px;
                color: #333;
                font-size: 12px
           }
        }
//      列表部分
        .info-list{
           display:table;
           padding-bottom:10px; 
           .list-item{
                display:table;
                margin-bottom:10px;
                dt{ 
                   display:table-cell;
                   width:50px;
                   padding-right:10px;
                }
                dd{
                   display:inline-block;
                   border: 1px solid #ff6600;
                   padding: 5px 20px;
                   vertical-align: middle;
                   
                }
                .last{
                    border:none;
                    padding:5px 0;
                    position:relative;
                    .reduse,.push{
                        float: left;
                        width: 28px;
                        height: 18px;
                        padding: 5px 0;
                        font-size: 14px;
                        border: 1px solid #e6e1df;
                        text-align: center;
                    }
                    input{
                        float: left;
                        width: 32px;
                        height: 20px;
                        padding: 4px;
                        font-size: 12px;
                        border: 1px solid #e6e1df;
                        color: #33302e;
                        text-align: center;
                    }  
                }
                .btn-sub{
                    width:100px;
                    height:40px;
                    background: #FF7B23;
                    color:#fff;
                    text-align: center;
                    border-radius:5px;
                    line-height: 40px;
                }
            }
        }
    }
}
